//得物编辑名称弹窗
import React, { useState } from 'react';
import CommonModal from '@/components/CommonModal';
import CommonLoading from '@/components/CommonLoading';
import { Input, Form, message } from 'antd';
import { layout1 } from '@/utils/config';

const AddDeWu = ({ visible, handleVisible, handleOk }) => {
  const [form] = Form.useForm();
  const [loading, setLoading] = useState(false);

  const onOk = () => {
    form.validateFields().then((val) => {
      const { storeName } = val;
      handleOk(val);
    });
  };

  return (
    <CommonModal
      title="编辑名称"
      visible={visible}
      onCancel={() => handleVisible(false)}
      onOk={onOk}
      minHeight="150px"
      width="600px"
    >
      <Form {...layout1} form={form} name="add-jushuitan-store">
        <Form.Item
          name="storeName"
          label="得物店铺"
          rules={[
            { required: true, message: '店铺名不能为空' },
            { max: 10, message: '不能超过10个字符' },
          ]}
        >
          <Input placeholder="请输入名称" />
        </Form.Item>
      </Form>
      <CommonLoading loading={loading} />
    </CommonModal>
  );
};

export default AddDeWu;
